<template>
  <LowCode :schema="schema" />
</template>

<script setup>
import LowCode from '@/components/LowCode.vue'
import { provide, inject } from 'vue'

const emit = defineEmits(['query'])

const props = defineProps({
  querys: {
    type: Array,
    default: () => []
  }
})

const lowCodeCrud = inject('lowCodeCrud')

provide('lowCodeCrudQuery', {
  setForm: (formFn) => {
    lowCodeCrud.setForm(formFn)
  }
})

const querys = props.querys
const queryItems = querys.map((item) => {
  if (!item.type) {
    item.type = 'input-text'
  }
  item.event = item.event || {}
  item.event.change = () => {
    setTimeout(() => {
      emit('query')
    }, 0)
  }
  return item
})

const schema = {
  type: 'form',
  columnCount: 4,
  body: queryItems,
  isCrudQueryForm: true,
  actions: []
}
</script>
